<!--
 * @Author: WangGuojian 1085844536@qq.com
 * @Date: 2023-08-16 18:54:55
 * @LastEditTime: 2023-08-16 19:01:49
 * @LastEditors: WangGuojian 1085844536@qq.com
 * @FilePath: \htmld:\Developer\WGJ\VSCode_WorkSpace\Web\vue\vue-basic\16-自定义指令\demo.html
 * @Description:
-->
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <style>
            .demo {
                background-color: orange;
            }
        </style>
    </head>
    <body>
        <button id="btn">点我创建一个输入框</button>
        <script type="text/javascript">
            const btn = document.getElementById('btn');
            btn.onclick = () => {
                const input = document.createElement('input');

                input.className = 'demo';
                input.value = 99;
                input.onclick = () => {
                    alert(1);
                };

                document.body.appendChild(input);

                input.focus();
                // input.parentElement.style.backgroundColor = 'skyblue';
                console.log(input.parentElement);
            };
        </script>
    </body>
</html>
